import styleVar from '@/styles/variable.module.scss'
import { toStrFirstCase } from '@/utils'
import type { ExtrackExpose, ExtractProps } from '@/utils/type'
import type LoadPage from '@/components/load-page'
import type { PropType } from 'vue'
import type Com from './index.vue'

export enum DefaultSlots {
  top = 'top',
  left = 'left',
  bottom = 'bottom',
  right = 'right',
  refresher = 'refresher',
  loadingMoreDefault = 'loadingMoreDefault',
  loadingMoreLoading = 'loadingMoreLoading',
  loadingMoreNoMore = 'loadingMoreNoMore',
  loadingMoreFail = 'loadingMoreFail',
  empty = 'empty',
  backToTop = 'backToTop',
  default = 'default'
}
namespace Paging {
  export const name = toStrFirstCase(`${styleVar.namespace}Paging`)
  export const variables = {
    layoutSlot: [
      DefaultSlots.top,
      DefaultSlots.left,
      DefaultSlots.right,
      DefaultSlots.bottom
    ] as const,
    loadingMoreSlot: [
      DefaultSlots.loadingMoreDefault,
      DefaultSlots.loadingMoreLoading,
      DefaultSlots.loadingMoreNoMore,
      DefaultSlots.loadingMoreFail,
    ] as const,
  }
  export const props = {
    loadPage: {
      type: Object as PropType<LoadPage.Props & { 
        /** 是否显示加载组件，当 fixed 为 true 时此属性默认 true */
        showLoading?: boolean,
        /** 需要使用加载组件里的功能，但不需要显示元素节点 */
        hidePage?: boolean
      }>,
      default: {}
    }
  }
  export type Props = ExtractProps.Types<typeof props> & ZPagingProps
  export type Slots = ZPagingSlots
  export const Component = <{
    new(): {
      $props: Props
      $slots: Slots
    }
  }>{}
  export type Instance = ExtrackExpose.Types<typeof Com>
}
export default Paging